<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <button id="button">改变颜色</button>
    <script>



        //     function Button(id) {

        //         this.element = document.getElementById(id);
        //         this.bindEvent()
        //     }
        //     Button.prototype.bindEvent = function() {
        //         console.log(this) //这里的this 指的是 new 出来的对象也就是 button ，但是不能直接写button，因为在创建函数上下文的时候button还是undefined
        //         // console.log(button)
        //         this.element.addEventListener('click',this.setBgColor.bind(this),false)
        //     };
        //     Button.prototype.setBgColor = function() {
        //         console.log(this,'指向 element')
        //         this.element.style.backgroundColor = '#1abc9c'
        //     }
        //     var button =   new Button('button')
        //   console.log(button ===  Button.constructor)
        // function Name(name) {
        //     this.name = name;
        // }
        // let name = new Name('daisy')
        // console.log(name)
        // console.log(name.__proto__ === Name.prototype)  // true
        // console.log(Name === Name.prototype.constructor ) //true

        // function Foo () {

        // }
        // var f1 = new Foo()
        // f1.a = 10
        // f1.c = 30
        // f1.d = 40
        // Foo.prototype.a = 100
        // Foo.prototype.b = 200

        // var item;
        // // for(item in f1) {
        // //     console.log(item)
        // // }
        // for(item in f1) {
        //     if(f1.hasOwnProperty(item)) {
        //         console.log(item)
        //     }
        // }
        // var f2 = new Foo()
        // console.log(f2.a)

        //     Function.prototype.call2 = function(context) {
        //     context.fn = this; //this就是bar
        //     context.fn();
        //     delete context.fn;
        // }
        //     var foo = {
        //         value: 1
        //     }

        // function bar() {
        //     console.log(this.value)
        // }

        // bar.call(foo) // 1

        // var obj = {
        //     x:1,
        //     fn: function() {
        //         console.log(this)
        //         console.log(this.x)
        //     }
        // }
        // // var fn = function() {
        // //     console.log(this)
        // //     console.log(this.x)

        // // }
        // // fn.call(obj)
        // var fn1 = obj.fn
        // fn1()
        function fn() {
            var a = 10
            function fb() {
                console.log(a)
            }
            fb()
        }
        fn()
    </script>
</body>

</html>